.myclass { height: 100%; }

.myclass .top { background: #fff; display: flex; justify-content: space-between; padding: 0px 10px; height: 44px; line-height: 44px; font-size: 16px; color: #333; }

.myclass .top .right { width: 16px; }

.myclass .top .right .iconfont { font-size: 22px; color: #333; }

.myclass .course { padding: 10px 0; }

.myclass .course .content ul .adm-swipe-action-action-button { padding: 7px; }

.myclass .course .content ul .adm-swipe-action-action-button span { font-size: 12px; }

.myclass .course .content ul li { width: 335px; height: 80px; padding: 10px; margin: 10px; background-color: #fff; box-shadow: 0 0 10px #e8e8e8; display: flex; border-radius: 5px; overflow: hidden; }

.myclass .course .content ul li .img { position: relative; width: 80px; height: 80px; border-radius: 5px; overflow: hidden; }

.myclass .course .content ul li .img img { width: 100%; height: 100%; object-fit: cover; vertical-align: bottom; }

.myclass .course .content ul li .img .icons { padding: 3px 5px; text-align: center; background-color: #7ec032; font-size: 10px; position: absolute; top: 0; left: 0; color: #fff; top: -4px; left: -5px; transform: scale(0.7); }

.myclass .course .content ul li .img .icon { transform: translate(-50%, -50%); position: absolute; top: 50%; left: 50%; width: 26px; background: url(http://pub.szzhangchu.com/web/v4.2/images/ico/ico-play.png); background-size: 100%; height: 26px; display: inline-block; }

.myclass .course .content ul li .img .video-count { position: absolute; bottom: 4px; left: 4px; color: #fff; font-size: 10px; }

.myclass .course .content ul li .text { margin-left: 10px; width: 235px; }

.myclass .course .content ul li .text h2 { color: #1e1e1e; font-size: 14px; font-weight: bold; margin-bottom: 10px; }

.myclass .course .content ul li .text span { margin-bottom: 10px; color: #939393; font-size: 12px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
